<template>
    <div class="split-page" style="display: flex">
        <div class="ucenter-common">
            <a-card :bordered="false" style="min-height: 40vh">
                <div class="main-right-content">
                    <div class="right-photo">
                        <img src="../../assets/wcxin.jpg">
                        <div class="hover-photo">
                            <a title="去设置头像">修&nbsp;改<br>头&nbsp;像</a>
                        </div>
                    </div>
                    <h2 class="right-name">Hi，10***49</h2>
                    <h3 class="right-info"><span>**新</span> <span>176******08</span></h3>
                    <div class="right-icon">
                        <div>&nbsp;</div>
                        <div title="实名认证" class="right-icon-has">
                            <img src="../../assets/icon_cert.png">
                            <img src="../../assets/open.png" class="right-open">
                        </div>
                        <div title="绑定手机" class="right-icon-has">
                            <img src="../../assets/icon_phone.png">
                            <img src="../../assets/open.png" class="right-open">
                        </div>
                        <div title="密码" class="right-icon-has">
                            <img src="../../assets/icon_password.png">
                            <img src="../../assets/open.png" class="right-open">
                        </div>
                        <div title="绑定邮箱" class="right-icon-has">
                            <img src="../../assets/icon_email.png">
                            <img src="../../assets/open.png" class="right-open">
                        </div>
                        <div>&nbsp;</div>
                    </div>
                </div>
            </a-card>
        </div>
        <div style="flex: 1;">
            <a-card :bordered="false" style="min-height: calc(100vh - 160px)">
                <router-view/>
            </a-card>
        </div>
    </div>
</template>
